<template>
  <div class="app-container calendar-list-container">
    <div v-if="!opShow">
      <search :list="queryList" :queryEntity="queryEntity"></search>
      <buttons :showQuery="true" :showBack="false" @query="doQuery" :list="btnList" :disabled="disabled" placeholder="订单号" :permissions="permissions" @add="doAdd"></buttons>
      <grid :columns="columns" :multi="true" :url="queryUrl" ref="mainGrid" height="auto" diffHeight="125" @change="rowCilck" :queryEntity="queryEntity" :pagination="true"
        :permissions="permissions"></grid>
    </div>
  </div>
</template>

<script>
import request from '@/router/axios'
import url from '@/const/apiURL'
import grid from '@/components/Grid'
import buttons from '@/components/Buttons'
import { Message, MessageBox } from 'element-ui'
import { mapGetters } from 'vuex'
import { YesOrNoFormatter, SaleOutOrderStatusFormatter } from '@/const/dict'
import search from '@/components/Search'
import { colunms } from '@/const/colunms'
import { dict } from '@/const/dict'
import { queryField } from '@/const/query'

export default {
  components: { grid, buttons, search },
  data () {
    return {
      queryUrl: url.SEND_LIST_URL,
      disabled: true,
      opShow: false,
      queryEntity: { orderStatus: 'FINISH' },
      columns: [
        { label: '大货订单', width: 180, prop: 'orderNo', align: 'left' },
        { label: '发货单号', width: 180, prop: 'sendCode', align: 'left' },
        { label: '仓库名称', width: 120, prop: 'warehouseName', align: 'left' },
        { label: '客户名称', width: 200, prop: 'customerName', align: 'left' },
        { label: '数量', width: 80, prop: 'quantity', align: 'center' },
        { label: '币种', width: 80, prop: 'currency', align: 'center' },
        { label: '总价', width: 100, prop: 'totalAmount', align: 'center' },
        { label: '对账单号', width: 180, prop: 'billNo', align: 'center' },
        { label: '是否对账', width: 80, prop: 'billStatus', align: 'center', formatter: YesOrNoFormatter },
        { label: '订单状态', width: 80, prop: 'orderStatus', align: 'center', formatter: SaleOutOrderStatusFormatter },
        { label: '订单号', width: 180, prop: 'orderNo', align: 'center' },
        { label: '发货时间', width: 160, prop: 'sendTime', align: 'center' },
        { label: '创建时间', width: 160, prop: 'createTime', align: 'center' }
      ],
      btnList: [
        { name: '创建对账单', type: 'primary', icon: 'edit', click: 'add', auth: 'order_finance_add', ctr: true, confirm: true }
      ],
      queryList: [
        { name: '发货单号', type: 'text', prop: 'sendCodeLike', placeholder: "发货单号" },
        { name: '创建时间', type: 'date', prop: 'startTime', placeholder: "" },
        { name: '----', type: 'date', prop: 'endTime', placeholder: "" },
        { name: '对账状态', type: 'select', prop: 'billStatus', placeholder: "对账状态", values: dict().YesOrNo, label: 'name', value: 'value' },
        { name: '客户名称', type: 'query', prop: 'customerCode', rowValue: 'customerCode', rowName: 'customerName', url: url.CUSTOMER_LIST_URL, columns: colunms().customerColumns, pagination: true, queryList: queryField().customer, queryEntity: { customerType: 'CUSTOMER' } }
      ]
    }
  },
  created () { },
  computed: {
    ...mapGetters(['permissions'])
  },
  methods: {
    doQuery (text) {
      this.$refs['mainGrid'].doQuery(text)
    },
    rowCilck (row) {
      this.disabled = row.length == 0
    },
    doAdd () {
      const rows = this.$refs['mainGrid'].getCurrentRows()
      let orderNos = [];
      rows.forEach(element => {
        orderNos.push(element.sendCode)
      });
      if (orderNos.length > 0) {
        this.addOp(orderNos, new Date(), new Date()).then(data => {
          if (data) {
            this.doQuery()
          }
        })
      }
    },
    addOp (orderNos, startDate, endDate) {
      return request({
        url: url.FINA_ORDER_BILL_ADD_URL,
        method: 'post',
        data: { orderNos, startDate, endDate }
      })
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
</style>
